import { defineConfig } from 'vite'
import { resolve } from 'path'
import { ArcoResolver } from 'unplugin-vue-components/resolvers'
import { vitePluginForArco } from '@arco-plugins/vite-vue'
import { createHtmlPlugin } from 'vite-plugin-html'
import vue from '@vitejs/plugin-vue'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import vueJsx from '@vitejs/plugin-vue-jsx'
import Pages from 'vite-plugin-pages'
import Layouts from 'vite-plugin-vue-layouts'

const pathResolve = (dir) => {
  return resolve(__dirname, '.', dir)
}

// https://vitejs.dev/config/
export default ({ mode }) =>
  defineConfig({
    plugins: [
      vue(),
      vueJsx({}),
      createHtmlPlugin({
        inject: {
          data: {
            title: 'pakchoi',
            keywords: '这里是keywords',
            description: '这里是description',
          },
        },
      }),
      Pages({
        extensions: ['vue', 'tsx'],
        exclude: ['**/modules/*{.vue,.tsx}'],
        importMode: 'async',
        routeNameSeparator: '-', // important
      }),
      Layouts({
        layoutsDirs: 'src/layout',
        defaultLayout: 'Menu',
      }),
      AutoImport({
        include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/, /\.md$/],
        imports: [
          'vue',
          'vue-router',
          'pinia',
          '@vueuse/core',
          {
            '@iconify/vue': ['Icon'],
          },
          {
            'echarts-for-vue': ['plugin', 'createComponent'],
          },
          {
            gsap: ['gsap'],
          },
          {
            '@iconify/vue': ['Icon'],
          },
          {
            '@arco-design/web-vue': ['Modal', 'Message', 'Notification'],
          },
        ],
        dirs: ['./src/utils', './src/utils/funcs', './src/hooks', './src/pinia/modules'],
        dts: './auto-imports.d.ts',
      }),
      Components({
        resolvers: [
          ArcoResolver({
            importStyle: false,
            sideEffect: true,
          }),
        ],
        include: [/\.vue$/, /\.[tj]sx?$/],
        dirs: ['./src/components'],
        deep: true,
        directoryAsNamespace: true,
      }),
      vitePluginForArco({
        style: 'css',
      }),
    ],
    // esbuild: {
    //   jsxInject: `import React from 'react'`,
    // },
    base: './',
    resolve: {
      alias: {
        '@': pathResolve('src'),
        api: pathResolve('src/api/'),
        svgs: pathResolve('src/assets/svgs/'),
        hooks: pathResolve('src/hooks'),
        imgs: pathResolve('src/assets/imgs/'),
        components: pathResolve('src/components'),
        utils: pathResolve('src/utils'),
        '@pinia': pathResolve('src/pinia/modules'),
      },
    },
    build: {
      outDir: 'dist',
      terserOptions: {
        compress: {
          drop_console: true,
          drop_debugger: true,
        },
      },
      rollupOptions: {
        external: ['codemirror'],
        input: {
          index: resolve(__dirname, 'index.html'),
        },
        output: {
          entryFileNames: '[hash].js',
          chunkFileNames: 'js/[hash].js', // [name]
          assetFileNames: '[ext]/[hash].[ext]',
        },
      },
    },
    server: {
      port: 6069, // 服务端口号
      open: true,
      cors: true,
      host: '0.0.0.0',
      proxy: {
        // '/xxxxx': {
        //   target: 'http://localhost:6066/', //https://pakchoi.windystory.com/
        //   changeOrigin: true,
        // },
        // '/xxx-api': {
        //   target: 'http://miniapps.windystory.com',
        //   changeOrigin: true,
        //   secure: false,
        //   rewrite: (path) => path.replace('/xxx-api', ''),
        // },
      },
    },
  })
